
import * as echarts from "echarts";
const colors = ['#0058C4','#ffffff','#00fff9','#49bdca','#1E5F6F','#c23531','#2f4554', '#61a0a8', '#d48265', '#91c7ae','#749f83'];
const colors1 = [new echarts.graphic.LinearGradient( 0, 0, 0, 1, // 这四个参数分别表示渐变的起点 (x1, y1) 与终点 (x2, y2)
    [
      { offset: 0, color: "#0ECFF8" }, // 0% 处的颜色
      { offset: 1, color: "#0570E9" }, // 100% 处的颜色
    ]
  ),
  new echarts.graphic.LinearGradient(0, 0, 0, 1, // 这四个参数分别表示渐变的起点 (x1, y1) 与终点 (x2, y2)
    [
      { offset: 0, color: "#932AE1" }, // 0% 处的颜色
      { offset: 1, color: "#303E8C" }, // 100% 处的颜色
    ]
  )
]
export const option = ref({
  color:["#FEC006","#00BFF3"],
  textStyle: {color:"#ffffff"}, 
  title: {
      text: '近五年学校项目量',
      //subtext: '',
      textStyle : {color:"#fff",fontSize:'16'},//标题样式
  },
  tooltip: {
    show: true
  },
  grid: [{
    left: 30,
    right: 30,
      // height: '80'
  }],
  xAxis: {
    splitLine: {show: false},
    type: 'category',
    data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
  },
  yAxis: {
    splitLine: {show: false},
    type: 'value'
  },
  series: [
    {
      data: [
        {
          value: 200,
          itemStyle: {
            color: colors1[0]
          }
        },
        {
          value: 250,
          itemStyle: {
            color: colors1[1]
          }
        },
        {
          value: 290,
          itemStyle: {
            color: colors1[0]
          }
        },
        {
          value: 100,
          itemStyle: {
            color: colors1[1]
          }
        },
        {
          value: 400,
          itemStyle: {
            color: colors1[0]
          }
        },
        {
          value: 600,
          itemStyle: {
            color: colors1[1]
          }
        },
        {
          value: 30,
          itemStyle: {
            color: colors1[0]
          }
        },
      ],
      type: 'bar',
      barMaxWidth: 13,
      itemStyle: {
        borderRadius: 7,
        color: colors1[1]
      },
      showBackground: true,
      backgroundStyle: {
        color: '#303E8C'
      }
    }
  ]
});

export const option2 = ref({
  textStyle: {color:"#ffffff"}, 
  title: {
    text: "本年度学院科研立项经费TOP5",
    left: "left",
    // top:20,
    textStyle: {
      fontSize: 16,
      color: "#fff"
    }
  },
  grid: {
    left: 30,
    right: 30,
  },
  tooltip: {
    show: true,
  },
  xAxis: {
    splitLine: {
      show: false, //分割线
    },
    data: ["2021", "2022", "2023","2024", "2025"],
  },
  yAxis: {
    name: "",
    splitLine: {
      show: true,
      lineStyle: {
      // 使用深浅的间隔色
        color: ['#50557a', '#50557a']
      }
    },
  },
  series: [
    {
      name: "到账经费",
      type: "bar",
      barWidth: 12,
      barGap: "100%",
      itemStyle: {
        borderRadius: 5,
        color:"#3292FF"
      },
      data: [5, 20, 36,30,50],
    },
    {
      name: "立项经费",
      type: "bar",
      barWidth: 12,
      itemStyle: {
        borderRadius: 5,
        color: "#2ED1FF"

      },
      data: [10, 10, 20,40,50],
    },
  ],
});


export const option3 = ref({
  title: {
    text: "近五年论文发表情况",
    textStyle: {
      fontSize: 16,
      color: "#fff"
    },
  },  
  color:"#0058C4",
  textStyle: {color:"#ffffff"},
  tooltip: {
    show: true,
  },
  grid: {
    left: 30,
    right: 30,
      // height: '80'
  },
  xAxis: {
    type : 'category',
    boundaryGap : false,
    axisLine: {onZero: true},
    axisLine: {
      show: false, //坐标轴
    },
    data:  ['2021', '2022', '2023', '2024', '2025']
  },
  yAxis : {
    type : 'value',
    // max : 10,
    splitLine: {
      show: false
    }

  },
  series : [
      {
          name:'',
          type:'line',
          symbolSize: 12,
          smooth: 0.6,
          lineStyle: {
            color: '#5470C6',
            width: 3
          },
          hoverAnimation: false,
          data:[
            0.97,3.96,4.96,2.95,9.95,6.94,4.94,8.94,4.94,0.94
          ]
      }
  ]
});


export const option5 = ref({
  color: gradientColors,
  textStyle: {color:"#ffffff"}, 
  title: {
    text: "本年度项目经费",
    left: "left",
    // top: 20,
    textStyle: {
      fontSize: 16,
      color: "#fff"
    },
  },
  tooltip: {
    trigger: 'item'
  },
  legend: {
    orient: 'vertical',
    top: '40%',
    left: 'right',
    textStyle: {
      color: "#ffffff",
    },
  },
  series: [
    {
      name: '本年度项目经费',
      type: 'pie',
      radius: ['45%', '55%'],
      avoidLabelOverlap: false,
      padAngle: 5,
      itemStyle: {
        borderRadius: 10
      },
      label: {
        normal: {
          show: true,
          position: 'center',
          // color: '#4c4a4a',
          formatter: '{total|' + 200 + '}' + '\\n\\r' + '{active|万元}',
          // formatter:(params) => {
          //   console.log(params)
          // },
          rich: {
            total: {
            fontSize: 35,
            fontFamily: "微软雅黑",
            color: '#fff'
            },
            active: {
              fontFamily: "微软雅黑",
              fontSize: 16,
              color: '#fff',
              lineHeight: 30,
            }
          }
        },
        emphasis: {
          show: true,
          formatter:'{b}: {d}'
        }
      },
      // lableLine: {
      //   normal: {
      //     show: false
      //   },
      //   emphasis: {
      //     show: true
      //   }
      // },
      
      // label: {
      //   show: false,
      //   position: 'center'
      // },
      // emphasis: {
      //   label: {
      //     show: true,
      //     fontSize: 20,
      //     fontWeight: 'bold',
      //     formatter:'{b}: {d}'
      //   }
      // },
      // labelLine: {
      //   show: false
      // },
      tooltip: {
        show: false
      },
      data: [
        { value: 1048, name: '纵向项目' },
        { value: 735, name: '横向项目' },
        { value: 580, name: '校级项目' }
      ]
    }
  ]
});
export const option5_2 = ref({
  color: gradientColors,
  textStyle: {color:"#ffffff"}, 
  title: {
    text: "本年度项目经费",
    left: "left",
    // top: 20,
    textStyle: {
      fontSize: 16,
      color: "#fff"
    },
  },
  tooltip: {
    trigger: 'item'
  },
  legend: {
    orient: 'vertical',
    top: '40%',
    left: 'right',
    textStyle: {
      color: "#ffffff",
    },
  },
  series: [
    {
      name: '本年度项目经费',
      type: 'pie',
      radius: ['45%', '55%'],
      avoidLabelOverlap: false,
      padAngle: 5,
      itemStyle: {
        borderRadius: 10
      },
      // label: {
      //   normal: {
      //     show: true,
      //     position: 'center',
      //     color: '#4c4a4a',
      //     formatter: '{total|' + 200 + '}' + '\\n\\r' + '{active|万元}',
      //     rich: {
      //       total: {
      //       fontSize: 35,
      //       fontFamily: "微软雅黑",
      //       color: '#fff'
      //       },
      //       active: {
      //         fontFamily: "微软雅黑",
      //         fontSize: 16,
      //         color: '#fff',
      //         lineHeight: 30,
      //       }
      //     }
      //   },
      //   emphasis: {
      //     show: true,
      //     formatter:'{b}: {d}'
      //   }
      // },
      // lableLine: {
      //   normal: {
      //     show: false
      //   },
      //   emphasis: {
      //     show: true
      //   }
      // },
      
      label: {
        show: true,
        position: 'center',
        formatter:'{b}: {d}'
      },
      emphasis: {
        label: {
          show: true,
          fontSize: 20,
          fontWeight: 'bold',
          formatter:'{b}: {d}'
        }
      },
      labelLine: {
        show: false
      },
      tooltip: {
        show: false
      },
      data: [
        { value: 1048, name: '纵向项目' },
        { value: 735, name: '横向项目' },
        { value: 580, name: '校级项目' }
      ]
    }
  ]
});